<template>
  <div class="box">
    <van-pull-refresh v-model="isLoading" @refresh="onRefresh">
      <p>刷新次数: {{ count }}</p>
      <div class="test">test</div>
    </van-pull-refresh>
  </div>
</template>
<script>
export default {
  data() {
    return {
      count: 0,
      isLoading: false,
    };
  },
  methods: {
    onRefresh() {
      console.log("放手刷新");
      setTimeout(() => {
        this.isLoading = false;
      }, 1000);
    },
  },
};
/*
1. 样式 父元素 设置 overflow 内容要超出区域
2. isLoading表示正在加载用 放手的时候组件会将他变成true
3. 数据请求完毕后变回false
*/
</script>
<style lang="less" scoped>
@import "@styles/index.less";
.box {
  background: pink;
  height: 500px;
  overflow: scroll;
  .test {
    background: green;
    width: 100px;
    height: 100px;
  }
}
</style>
